
<?php
//include 'login_to_database.php';
//mysql_connect('localhost', 'root', '');  
//mysql_select_db('testss');
//$result = mysql_query("SELECT * FROM `categoory` ") or die(mysql_error());
?> 
<style>

.nd-menu{opacity:0;background:#c3bfbf;margin-left:1px;text-align:center;transition:background 1s, opacity 1s;filter: alpha(opacity = 0);
-moz-transition:background 1s,opacity 1s,-moz-transform 1s; /* Firefox 4 */
-webkit-transition:background 1s,opacity 1s,-webkit-transform 1s; /* Safari and Chrome */
-o-transition:background 1s, opacity 1s, -o-transform 1s; /* Opera */}
.menu-item2{position:absolute;z-index:100;left:265px}
.Menus .menu-item2 ul li:hover .nd-menu1{width:1222px;height:100px;z-index:105;opacity:1;background:#00F; position:absolute;top:73px;left:-172px}
.tuany{display:none}
.tuans{display:block;background:#FFF;width:1242px;height:auto;position:absolute;z-index:100;padding:5px}



.anh-slide1{float:left;padding:0px;width:621px;background:#006;height:100px;
}
.anh-slide2{float:left;padding:0px;width:310.5px;background:#FF0;height:100px;
}

.anh-slide3{float:left;padding:0px;width:310.5px;background:#FF0;height:100px;
}
.anh-slide4{float:left;padding:0px;width:621px;background:#FF0;height:100px;
}
.anh-slide5{float:left;padding:0px;width:310.5px;background:#FF0;height:100px;
}

.anh-slide6{float:left;padding:0px;width:310.5px;background:#FF0;height:100px;
}
.anh-slide7{float:left;padding:0px;width:310.5px;background:#FF0;height:100px;
}
.anh-slide2 span{background:#009;width:310.5px;height:100px;display:block}
.anh-slide3 span{background:#009;width:310.5px;height:100px;display:block}

.anh-slide5 span{background:#009;width:310.5px;height:100px;display:block}
.anh-slide6 span{background:#009;width:310.5px;height:100px;display:block}
.anh-slide7 span{background:#009;width:310.5px;height:100px;display:block}



.nd2
{
margin-top:-100px;
width:310.5px;
height:100px;
background:red;
position:relative;
animation:mymove1 9s;
animation-iteration-count:infinite;
/* Firefox */
-moz-animation:mymove1 9s;
-moz-animation-iteration-count:infinite;
/* Safari and Chrome */
-webkit-animation:mymove1 9s;
-webkit-animation-iteration-count:infinite;
/* Opera */
-o-animation:mymove1 9s;
-o-animation-iteration-count:infinite;
}

@keyframes mymove1
{
from {width:310.5px}
to {width:0px}
}

@-moz-keyframes mymove1 /* Firefox */
{
from {width:310.5px}
to {width:0px}}

@-webkit-keyframes mymove1 /* Safari and Chrome */
{
from {width:310.5px}
to {width:0px}
}

@-o-keyframes mymove1 /* Opera */
{
from {width:310.5px}
to {width:0px}
}



.nd3
{
margin-top:-100px;
width:310.5px;
height:100px;
background:red;
position:relative;
animation:mymove2 6s;
animation-iteration-count:infinite;
/* Firefox */
-moz-animation:mymove2 6s;
-moz-animation-iteration-count:infinite;
/* Safari and Chrome */
-webkit-animation:mymove2 6s;
-webkit-animation-iteration-count:infinite;
/* Opera */
-o-animation:mymove2 6s;
-o-animation-iteration-count:infinite;
}

@keyframes mymove2
{
from {height:0px}
to {height:100px}
}

@-moz-keyframes mymove2 /* Firefox */
{
from {height:0px}
to {height:100px}}

@-webkit-keyframes mymove2/* Safari and Chrome */
{
from {height:0px}
to {height:100px}
}

@-o-keyframes mymove2 /* Opera */
{
from {height:0px}
to {height:100px}
}



.nd5
{
margin-top:-100px;
width:310.5px;
height:100px;
background:red;
position:relative;
animation:mymove4 7s;
animation-iteration-count:infinite;
/* Firefox */
-moz-animation:mymove4 7s;
-moz-animation-iteration-count:infinite;
/* Safari and Chrome */
-webkit-animation:mymove4 7s;
-webkit-animation-iteration-count:infinite;
/* Opera */
-o-animation:mymove4 7s;
-o-animation-iteration-count:infinite;
}

@keyframes mymove4
{
from {width:0px}
to {width:310.5px}
}

@-moz-keyframes mymove4 /* Firefox */
{
from {width:0px}
to {width:310.5px}}

@-webkit-keyframes mymove4/* Safari and Chrome */
{
from {width:0px}
to {width:310.5px}
}

@-o-keyframes mymove4 /* Opera */
{
from {width:0px}
to {width:310.5px}
}




.nd6
{
margin-top:-100px;
width:310.5px;
height:100px;
background:red;
position:relative;
animation:mymove5 8s;
animation-iteration-count:infinite;
/* Firefox */
-moz-animation:mymove5 8s;
-moz-animation-iteration-count:infinite;
/* Safari and Chrome */
-webkit-animation:mymove5 8s;
-webkit-animation-iteration-count:infinite;
/* Opera */
-o-animation:mymove5 8s;
-o-animation-iteration-count:infinite;
}

@keyframes mymove5
{
from {height:100px}
to {height:0px}
}

@-moz-keyframes mymove5 /* Firefox */
{
from {height:100px}
to {height:0px}
}

@-webkit-keyframes mymove5/* Safari and Chrome */
{
from {height:100px}
to {height:0px}
}

@-o-keyframes mymove5 /* Opera */
{
from {height:100px}
to {height:0px}
}

</style>
<div class="menu-item2" id="menu-item2">
    <ul>
  
      <li  class="list"><a href="">Home</a>
      </li>
      <li  class="list"><a href="">Home</a>
      </li>
      <li  class="list"><a href="">Home</a>
      </li>
      <li  class="list"><a href="">Home</a>
      </li>
      <li  class="list"><a href="">Home</a>
      </li>
     
    
    </ul>
</div>
<div class="clear"></div>
<div id="tuansd" class="tuany">
    <div class="result">
    </div>  
</div>
